<template>
    <div>
        <template>
            <div>
                <el-table :data="sumList" border show-summary style="width: 100%" :summary-method="getSummaries"
                    :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="" label="开发成本分配表">
                        <el-table-column prop="type_title" label="业态">
                        </el-table-column>
                        <el-table-column prop="area" label="建筑面积" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_sum_exclusive_ratio" label="分摊比例" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_1" label="土地使用权支付金额" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_2" label="土地征用及拆迁补偿费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_3" label="前期工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_4" label="建筑安装工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_5" label="基础设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_6" label="配套设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_7" label="开发间接费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_lxzc" label="利息支出" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_bykc" label="不予扣除成本" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_sum_exclusive" label="合计" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="a_dwcb" label="总单位成本" :formatter="stateFormat">
                        </el-table-column>
                    </el-table-column>
                </el-table>

                <!-- 开发成本分配表（配套成本摊入可售面积） --------------------------------------------------------------------------------- -->
                <el-table :data="sumList" border show-summary style="width: 100%" :summary-method="getSummaries"
                    :row-class-name="rowClassName" :header-cell-style="{ 'text-align': 'center' }"
                    :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="" label="开发成本分配表（配套成本摊入可售面积）">
                        <el-table-column prop="type_title" label="业态">
                        </el-table-column>
                        <el-table-column prop="area" label="建筑面积" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_sum_exclusive_ratio" label="分摊比例" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_1" label="土地使用权支付金额" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_2" label="土地征用及拆迁补偿费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_3" label="前期工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_4" label="建筑安装工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_5" label="基础设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_6" label="配套设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_7" label="开发间接费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_lxzc" label="利息支出" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_bykc" label="不予扣除成本" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_sum_exclusive" label="合计" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="b_dwcb" label="总单位成本" :formatter="stateFormat">
                        </el-table-column>
                    </el-table-column>
                </el-table>



                <!-- 开发成本分配表（已售比例分摊） --------------------------------------------------------------------------------- -->
                <el-table :data="sumList" border show-summary style="width: 100%" :summary-method="getSummaries"
                    :row-class-name="rowClassName" :header-cell-style="{ 'text-align': 'center' }"
                    :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="" label="开发成本分配表（已售比例分摊）">
                        <el-table-column prop="type_title" label="业态">
                        </el-table-column>
                        <el-table-column prop="sold" label="已售面积" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_sum_exclusive_ratio" label="已售比例" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_1" label="土地使用权支付金额" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_2" label="土地征用及拆迁补偿费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_3" label="前期工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_4" label="建筑安装工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_5" label="基础设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_6" label="配套设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_7" label="开发间接费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_lxzc" label="利息支出" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_bykc" label="不予扣除成本" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_sum_exclusive" label="合计" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="c_dwcb" label="总单位成本" :formatter="stateFormat">
                        </el-table-column>
                    </el-table-column>
                </el-table>

                <!-- 开发成本分配表（未售比例分摊） --------------------------------------------------------------------------------- -->
                <el-table :data="sumList" border show-summary style="width: 100%" :summary-method="getSummaries"
                    :row-class-name="rowClassName" :header-cell-style="{ 'text-align': 'center' }"
                    :cell-style="{ 'text-align': 'center' }">
                    <el-table-column prop="" label="开发成本分配表（未售比例分摊）">
                        <el-table-column prop="type_title" label="业态">
                        </el-table-column>
                        <el-table-column prop="no_sold" label="已售面积" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_sum_exclusive_ratio" label="已售比例" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_1" label="土地使用权支付金额" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_2" label="土地征用及拆迁补偿费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_3" label="前期工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_4" label="建筑安装工程费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_5" label="基础设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_6" label="配套设施费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_7" label="开发间接费" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_lxzc" label="利息支出" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_bykc" label="不予扣除成本" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_sum_exclusive" label="合计" :formatter="stateFormat">
                        </el-table-column>
                        <el-table-column prop="d_dwcb" label="总单位成本" :formatter="stateFormat">
                        </el-table-column>
                    </el-table-column>
                </el-table>

            </div>
        </template>
    </div>
</template>

<script>
import calculateApi from '@/api/calculate'

export default {
    data() {
        return {
            calculate_id: '',
            buildingNumberList: [],
            sumList: [],
        }

    },
    methods: {
        getCalculateBuildingNumberList() {
            calculateApi.getCalculateBuildingNumberList(this.calculate_id).then(response => {
                this.buildingNumberList = response.data.list;
                this.sumList = response.data.sum;
            })
        },
        rowClassName({ row, rowIndex }) {
            if (row.type === 6 || row.type === 10) {
                return 'warning-row';
            }
            return '';
        }
    },
    created() {
        var query = this.$route.query;
        if (query.id) {
            this.calculate_id = query.id;
        }

        this.getCalculateBuildingNumberList();
    },
}
</script>

<style>
.el-table .warning-row {
    display: none;
}

.el-table {
    .cell:empty::before {
        content: "---";
        color: #ccc;
    }

    .is-leaf {
        .cell:empty::before {
            content: "---";
            color: #ccc;
        }
    }
}
</style>